<div id="div_liste_bon_retour" class="row-fluid">
    <div class="span12">
        <div class="box gradient">
            <div class="title" style="text-align: center">
                <h4>Liste Bons Retour</h4>
            </div>
            <div id="div-list-user" class="content noPad clearfix">
                <div id="DataTables_Table_0_wrapper" class="dataTables_wrapper" role="grid">
                    <div id="DataTables_Table_0_filter" class="dataTables_filter">
                        <table>
                            <tr style="width: 100%">
                                <td style="width: 15%">
                                    <label>
                                        Departement:
                                        {{ render(controller('GdsVenteBundle:Devis:getAllDepartement')) }}
                                    </label>
                                </td>
                                <td style="width: 15%">
                                    <label>
                                        Raison Social:
                                        {{ render(controller('GdsVenteBundle:Client:getAllClient')) }}
                                        <script> new autocomplete(document.getElementById("client"))</script>
                                    </label>
                                </td>
                                <td style="width: 10%">
                                    <label>
                                        N° B.R:
                                        <input class="text" type="text" id="filtre_numero" style="width:80%;margin-left: 0"/>
                                    </label>
                                </td>
                                <td style="width: 10%">
                                    <label>
                                        Date:
                                        <input class="text" type="text" id="filtre_date1" style="width:80%;margin-left: 0"/>
                                    </label>
                                </td>
                                <td style="width: 10%">
                                    <label>
                                        Jusqu'à:
                                        <input class="text" type="text" id="filtre_date2" style="width:80%;margin-left: 0" />
                                    </label>
                                </td>
                                <td style="width: 10%">
                                    <label>
                                        TTC entre:
                                        <input class="text" type="text" id="filtre_ttc1" style="width:80%;margin-left: 0"/>
                                    </label>
                                </td>
                                <td style="width: 10%">
                                    <label>
                                        ET:
                                        <input class="text" type="text" id="filtre_ttc2" style="width:80%;margin-left: 0"/>
                                    </label>
                                </td>
                            </tr>
                        </table>
                    </div>
                    <div id="liste_bon_retour">
                        {% include 'GdsVenteBundle:BonRetour:page_liste_bon_retour.html.twig' %}
                    </div>
                </div>
            </div>
        </div>
    </div><!-- End .box -->

</div><!-- End .span12 -->

<script>
    $(document).ready(function() {
        date1 = ''
        date2 = ''
        var fullDate = new Date();
        var twoDigitMonth = fullDate.getMonth()
        twoDigitMonth++
        twoDigitMonth += "";
        if (twoDigitMonth.length == 1)
            twoDigitMonth = "0" + twoDigitMonth;
        var twoDigitDate = fullDate.getDate() + "";
        if (twoDigitDate.length == 1)
            twoDigitDate = "0" + twoDigitDate;
        var currentDate = twoDigitDate + "/" + twoDigitMonth + "/" + fullDate.getFullYear();
        $("#filtre_date2").val(currentDate)
        $("#filtre_date1").val('')
        $('#filtre_numero').val('')
        $('#filtre_ttc1').val('')
        $('#filtre_ttc2').val('')
        $('#client').val(0)
        $('#departement').val({{departement}})
        date2 = changeFormatDate($('#filtre_date2').val())
    })
    $("#filtre_date1").datepicker({
        changeMonth: true,
        onClose: function(selectedDate) {
            $("#filtre_date2").datepicker("option", "minDate", selectedDate);
        }
    });
    $("#filtre_date2").datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        onClose: function(selectedDate) {
            $("#filtre_date1").datepicker("option", "maxDate", selectedDate);
        }
    });
    $('#filtre_numero').keyup(function() {
        goToPage('{{path(pagination.route)}}?type=ajax')
    })
    $('#client').change(function() {
        goToPage('{{path(pagination.route)}}?type=ajax')
    })
    $('#filtre_date1').change(function() {
        date1 = changeFormatDate($('#filtre_date1').val())
        goToPage('{{path(pagination.route)}}?type=ajax')
    })
    $('#filtre_date2').change(function() {
        date2 = changeFormatDate($('#filtre_date2').val())
        goToPage('{{path(pagination.route)}}?type=ajax')
    })
    $('#filtre_ttc1').keyup(function() {
        goToPage('{{path(pagination.route)}}?type=ajax')
    })
    $('#filtre_ttc2').keyup(function() {
        goToPage('{{path(pagination.route)}}?type=ajax')
    })
    $('#departement').change(function() {
        goToPage('{{path(pagination.route)}}?type=ajax')
    })
    function goToPage(url) {
        $.ajax({
            url: url,
            mode:'abort',
            data: '&type=ajax&numero=' + $('#filtre_numero').val() + '&client=' + $('#client').val()
                    + '&date1=' + date1 + '&date2=' + date2
                    + '&ttc1=' + $('#filtre_ttc1').val() + '&ttc2=' + $('#filtre_ttc2').val()+ '&departement=' + $('#departement').val(),
            success: function(data) {
                $('#liste_bon_retour').html(data)
            }
        })
    }
    function changeFormatDate(date) {
        if (date == '')
            return date
        date = date.split('/')
        date = date[2] + '-' + date[1] + '-' + date[0]
        return date
    }
</script>

